$(function () {
    let id
    // 日期与时间
    function timeDate() {
        layui.use('laydate', function () {
            layui.laydate.render({
                elem: '#articleDate'
            });
        });
    }


    // 富文本编辑器
    function renderEditor() {
        tinymce.init({
            selector: '#articleContent',
            language: 'zh_CN',
        });
    }

    // 文章类别
    function getCategoryList() {
        $.get('/admin/category/list', function (res) {
            let html = ''
            res.data.forEach(value => {
                html += `<option value="${value.id}">${value.name}</option>`
                $('#category').html(html)
            });
        })
    }

    // 图片上传
    $('#inputCover').change(function () {
        const file = this.files[0]
        console.log(file)
        let url = URL.createObjectURL(file)
        $('#coverimg').prop('src', url)
    })

    // 发送请求 获取数据渲染到表单组件中
    function getArticleDetail() {
        const usp = new URLSearchParams(this.location.search)
        id = usp.get('id')
        $.get('/admin/article/search', { id }, function (res) {
            const { title, cover, categoryId, date, content } = res.data
            $('[name="title"]').val(title)
            $('#coverimg').prop('src', cover)
            $('[name="categoryId"]').val(categoryId)
            $('[name="date"]').val(date)
            $('#articleContent').val(content)
        })
    }

    // 给发布绑定点击事件
    $('.btn-edit').click(function () {
        publishArticle('已发布')
    })
    // 给草稿按钮绑定点击事件
    $('.btn-draft').click(function () {
        publishArticle('')
    })
    // 给“发布”按钮和“存为草稿”按钮封装点击事件函数
    function publishArticle(state) {
        // 将form放进FormData里边可以直接获取input标签的值，前提是input必须有name属性（使用原生JS获取form）
        let fd = new FormData($('#form')[0])
        const content = tinyMCE.editors['articleContent'].getContent();
        fd.append('content', content)
        fd.append('state', state)
        fd.append('id', id)
        $.ajax({
            url: '/admin/article/edit',
            type: 'post',
            data: fd,
            contentType: false,
            processData: false,
            success(res) {
                location.href = 'article_list.html'
            }
        })
    }



    timeDate()
    renderEditor()
    getCategoryList()
    getArticleDetail()
})